<template>
  <el-table :data="growthRecords" border stripe>
    <el-table-column prop="date" label="日期" width="180"></el-table-column>
    <el-table-column prop="description" label="获取途径"></el-table-column>
    <el-table-column prop="experience" label="经验值" width="120">
      <template #default="scope">
        <span style="color: #67c23a;">+{{ scope.row.experience }}</span>
      </template>
    </el-table-column>
  </el-table>
</template>

<script setup lang="ts">
import { ref } from 'vue';

const growthRecords = ref([
  { date: '2024-06-12 10:00:00', description: '完成首次购物', experience: 100 },
  { date: '2024-06-13 08:30:15', description: '每日签到', experience: 5 },
  { date: '2024-06-14 08:31:02', description: '每日签到', experience: 5 },
  { date: '2024-06-15 11:20:45', description: '参与平台活动 #123', experience: 50 },
  { date: '2024-06-16 08:29:55', description: '每日签到', experience: 5 },
]);
</script> 